<template>
  <ContainerGroup>
    <Container style="margin-bottom: 10px">
      <FilterForm ref="filterForm" :elements="filterElements" @submit="handleSearch" @reset="handleReset">
        <Button
          style="display: inline-block;"
          @click="handleExport"
          >导出</Button
        >
      </FilterForm>
    </Container>
    <Container height="fill" :scroll-y="true" display="flexY">
      <OperationContainer style="margin-bottom: 10px">
        <!-- <Button style="margin-right: 12px" @click="actionUnfoldFunc(true)"
          >导出</Button
        > -->
      </OperationContainer>
      <el-table ref="ctab" v-loading="tableLoading" :data="tableData" border
        :header-cell-style="{ background: '#fafafa', borderColor: '#e7ecf8' }" header-row-class-name="ck-table-header"
        row-class-name="ck-table-row" size="small" row-key="code" height="100%">
        <el-table-column align="center" type="index" label="序号" width="50" />
        <el-table-column prop="deptCode" label="科室编码" />
        <el-table-column prop="deptName" label="科室名称" />
        <el-table-column prop="thisBillThisExe" label="本开本执">
          <template slot-scope="scope">
            {{ scope.row.thisBillThisExe | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="otherBillThisExe" label="本执他开">
          <template slot-scope="scope">
            {{ scope.row.otherBillThisExe | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="thisBillOtherExe" label="本开他执">
          <template slot-scope="scope">
            {{ scope.row.thisBillOtherExe | numberToCurrency }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="suanname" label="基本工资间接成本" />
        <el-table-column prop="chengcode" label="基本工资直接成本" />
        <el-table-column prop="chengname" label="绩效工资间接成本" />
        <el-table-column prop="cheng" label="绩效工资直接成本" />
        <el-table-column prop="chengcode" label="其他工资间接成本" />
        <el-table-column prop="chengname" label="其他工资直接成本" /> -->
        <el-table-column prop="personnel" label="工资直接成本">
          <template slot-scope="scope">
            {{ scope.row.personnel | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectPersonnel" label="工资间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectPersonnel | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectSanitaryMaterials" label="卫生材料间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectSanitaryMaterials | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="sanitaryMaterials" label="卫生材料直接成本">
          <template slot-scope="scope">
            {{ scope.row.sanitaryMaterials | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="drug" label="药品费直接成本">
          <template slot-scope="scope">
            {{ scope.row.drug | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectDrug" label="药品费间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectDrug | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="fixed" label="固定资产折旧直接成本">
          <template slot-scope="scope">
            {{ scope.row.fixed | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectFixed" label="固定资产折旧间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectFixed | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="intangible" label="无形资产摊销直接成本">
          <template slot-scope="scope">
            {{ scope.row.intangible | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectIntangible" label="无形资产摊销间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectIntangible | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="risk" label="提取医疗风险基金直接成本">
          <template slot-scope="scope">
            {{ scope.row.risk | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectRisk" label="提取医疗风险基金间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectRisk | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="other" label="其他费用直接成本">
          <template slot-scope="scope">
            {{ scope.row.other | numberToCurrency }}
          </template>
        </el-table-column>
        <el-table-column prop="indirectOther" label="其他费用间接成本">
          <template slot-scope="scope">
            {{ scope.row.indirectOther | numberToCurrency }}
          </template>
        </el-table-column>
      </el-table>
      <!-- <div class="pagenation-box">
        <Pagination
          :total="pageAttr.total"
          :page="pageAttr.currentPage"
          :page-size="pageAttr.pageSize"
          @pagation="pagationChange"
        />
      </div> -->
    </Container>
  </ContainerGroup>
</template>

<script>
import { listCostWithDept,download8 } from "@/utils/apis/report";
export default {
  name: "FTU",
  data() {
    return {
      filterElements: [
        {
          key: "yearMonth",
          label: "年/月",
          mode: "monthrange",
          type: "date-picker",
          format: "yyyy-MM",
          value: [this.$util.currentDate(), this.$util.currentDate()],
          width: 340,
          // expiredDate: {
          //   disabledDate(time) {
          //     const start = new Date();
          //     return time.getTime() > start.setMonth(start.getMonth() - 1);
          //   },
          // },
        },
        // {
        //   key: "aihao",
        //   type: "Select",
        //   label: "院区",
        //   value: "",
        //   width: 210,
        //   options: [
        //     {
        //       label: "全部",
        //       value: "1",
        //     },
        //     {
        //       label: "浒关院区",
        //       value: "2",
        //     },
        //     {
        //       label: "三香院区",
        //       value: "3",
        //     },
        //   ],
        // },
      ],
      pageAttr: {
        pageSize: 20,
        currentPage: 1,
        total: 0,
      },
      tableData: [],
      tableLoading: false,
      newParamList: {},
    };
  },
  created() { },
  mounted() { },
  methods: {
    handleExport(){ //导出
        const fieldVal = this.$refs.filterForm.getParms()
          const startYearMonth = fieldVal?.yearMonth[0]
      const endYearMonth = fieldVal?.yearMonth[1]
         let currentYear = new Date(startYearMonth).getFullYear();
      let currentMonth = new Date(startYearMonth).getMonth() + 1;

      let endcurrentYear = new Date(endYearMonth).getFullYear();
      let endcurrentMonth = new Date(endYearMonth).getMonth() + 1;
        const param = {
            endYear: endcurrentYear,
        endMonth: endcurrentMonth,
        starMonth: this.formatNumber(currentMonth),
        starYear: currentYear,
        yard: "1",
        }
    download8(param).then(res => {
        const blob = new Blob([res.data], {
          type: res.data.type + 'charset=utf-8'
        })
        const downloadLink = document.createElement('a')
        const URL = window.URL || window.webkitURL || window.moxURL
        const downUrl = URL.createObjectURL(blob)
        downloadLink.href = downUrl
        downloadLink.download = '核算科室收入成本汇总表（核算单元）.xlsx'
        downloadLink.click()
        window.URL.revokeObjectURL(downUrl)
        // document.body.removeChild(downloadLink) // 删除 a 标签
      })
    },
    // 分页
    pagationChange(payload) {
      this.pageAttr.currentPage = payload.page;
      this.pageAttr.pageSize = payload.pageSize;
      this.getData(this.newParamList);
    },
    handleSearch(value) {
      this.newParamList = value;
      this.pageAttr.currentPage = 1;
      this.getData();
    },
    handleReset() {
      location.reload();
    },
    createNewData() { },
    getData() {
      // 列表
      const startYearMonth =
        this.newParamList.yearMonth && this.newParamList.yearMonth[0];
      const endYearMonth =
        this.newParamList.yearMonth && this.newParamList.yearMonth[1];
      let currentYear = new Date(startYearMonth).getFullYear();
      let currentMonth = new Date(startYearMonth).getMonth() + 1;

      let endcurrentYear = new Date(endYearMonth).getFullYear();
      let endcurrentMonth = new Date(endYearMonth).getMonth() + 1;
      let param = {
        endYear: endcurrentYear,
        endMonth: endcurrentMonth,
        starMonth: this.formatNumber(currentMonth),
        starYear: currentYear,
        yard: "1",
        // pageNum: this.pageAttr.currentPage,
        // pageSize: this.pageAttr.pageSize,
      };
      if (currentYear != endcurrentYear) {
        this.$message.warning("不能选择跨年时间段");
        return;
      }
      this.tableLoading = true;
      this.tableData = [];
      listCostWithDept(param).then((res) => {
        if (res.data.code === 200) {
          this.tableData = res.data.data;
          // this.pageAttr.total = res.data.data.total;
        }
        this.tableLoading = false;
      });
    },
    formatNumber(n) {
      n = n.toString();
      return n[1] ? n : `0${n}`;
    },
  },
};
</script>

<style lang="less" scoped>
.el-table--mini,
.el-table--small,
.el-table__expand-icon {
  font-size: 14px !important;
}

.ck-table-header {
  th {
    background: #fafafa !important;
    height: 48px;
    color: #555555 !important;
  }
}

.pagenation-box {
  display: flex;
  padding-top: 2px;
  justify-content: flex-end;
}

.text-btn {
  color: #2165f9;
  border-bottom: 1px solid #2165f9;
  display: inline-block !important;
  cursor: pointer;
}
</style>

